<script setup>
import {defineProps} from 'vue'
import {useRouter} from 'vue-router'
let router = useRouter()
let props = defineProps({
  list1: Array,
})
const jump = (index,text) => {
  router.push({
    path: '/delicacies',
    query: {
      title: text
    }
  })
}
</script>

<template>
  <div class="nav-item" v-for="(item,index) in list1" @click="jump(index,item.text)">
    <img :src="item.src">
    <p>{{ item.text }}</p>
  </div>
</template>

<style scoped>
.nav-item{
  text-align: center;
}
.nav-item img{
  width: 88px;
}
p{
  text-align: center;
}
</style>